﻿using System;
using System.Collections.Generic;
using System.Net;
using System.Windows.Browser;
using SilverQuery;

namespace SilverQueryDemo.jqia.chapter5
{
	/// <summary>
	/// This class is a SilverQuery port of the custom.effects.html sample from
	/// Chapter 5 of the book jQuery in Action.
	/// </summary>
	/// <remarks>
	/// The original jQuery sample can be downloaded from: http://www.manning.com/bibeault/
	/// </remarks>
	public class CustomEffects : SilverQueryComponent
	{
		public override void ready()
		{
			@q("#scaleButton").click(e =>
				{
					@q("#testSubject").each((i, elem) =>
						{
							@q(elem).animate(new map(){
								{ "width", @q(elem).width() * 2 },
								{ "height", @q(elem).height() * 2 }},
								"slow");
						});
					return false;
				});
			
			@q("#dropButton").click(e =>
				{
					@q("#testSubject").each((i, elem) =>
						{
							var current = @q(elem);
							current.css("position", "relative");
							
							int finalTop = @q(HtmlPage.Window).height() - current.height() - current.offset().top;
							
							current.animate(new map() { 
								{ "opacity", "hide" }, 
								{ "top",  finalTop } 
							}, "slow", 
							null, 
							()=> current.hide());
						});

					return false;
				});

			@q("#puffButton").click(e =>
				{
					@q("#testSubject").each((i, elem) =>
						{
							var current = @q(elem);
							var offset = current.offset();
							current.css(new map()
							{
								{ "position", "absolute"},
								{ "top", offset.top },
								{ "left", offset.left }
							});
							current.animate(new map()
							{
								{ "opacity", "hide"},
								{ "width", current.width() * 5},
								{ "height", current.height() * 5},
								{ "top", offset.top - (current.height() * 5/2) },
								{ "left", offset.left - (current.width() * 5/2) }
							}, "normal");
						});

					return false;
				});
		}
	}
}
